<template>
	<!-- 	<view class="kxzcdfer pd pt20 pm20 display-flex cen">
		<view class="fz30 flex-1 z9 " v-for="(item,idx) in immxer" @tap="kmmxcffg(idx)">
			<text class="pr" :class="kmxczxf==idx?'dsfsdrtxr':''">{{item}}</text>
		</view>
	</view> -->

	<view class="pd dsfsdcxxtrt">
		<template v-for="(item,idx) in jnxzcf">
			<view class="cdvcxdvrtecxrt pd pt20 pm20 mt20" >
			<view class="">
				{{item.content}}
			</view>
		
				<view class="mt20  display-flex fz24">
					<view class=" xzczfsderxct">
						姓名: <text class="z9">{{item.realName}}</text>
					</view>
				
				</view>
				
				<view class="czxczxsdt mt20">
					<view class="br" v-for="(sda,idxs) in item.imgUrl">
						<image @tap="kkzfds(item.imgUrl,idxs)" class="kdfsdfsdt" mode="aspectFill"
							:src="sda">
						</image>
					</view>
				</view>
				<view class="btm mt20 pt20 z9 fz24  display-flex">
					<view class=" flex-1">
						上传时间：{{item.createTime}}
					</view>
					<view class=" pd red  cen" @tap="dkmxdffdf(idx,item)">
						删除
					</view>
				</view>
				<text class="iconfont icon-shenhetongguo sdfddcdxcvdrty" v-if="item.isPass==2"></text>
				<text class="iconfont icon-butongguo red sdfddcdxcvdrty ab" v-if="item.isPass==3"></text>
			</view>
		</template>
		<view class="vertical-center mt100" v-if="jnxzcf.length<=0">
			<image src="../../static/img/noData.png" class="xczxcertfdgtrr"></image>
			<view class="mt20 z9 fz24">
				暂无数据!
			</view>
		</view>
	</view>

	<view class="shmmxczrt vertical-center" v-if="kmxcfer">
		<view class="kxcztrxett">
			<view class="pd pt20 pm20">
				<text class="kkxczxerwt">审核</text>
			</view>
			<view class="btm kxczzxerxzsrt">
				<view class="pd pt20">
					<input v-model="gxsdr.jobDay" type="text" placeholder="请输入工作天数" class="w100 kxcxzrert" />
						<radio-group @change="radioChange" class="mt20">
						<label class="xzczxctrt mr20" v-for="(item, index) in items" :key="item.dictValue">
							<view class="display-flex">
								<view>
									<radio :value="item.dictValue" class="kcxzvxcdrytr"/>
								</view>
								<view class="fz28 fgfdgdfgbty">{{item.dictLabel}}</view>
							</view>
						</label>

					</radio-group> 
						<view class="mt20 pm20" v-if="gxsdr.isPass==3">
						<textarea v-model="gxsdr.content" class="kxzczxretxctyt fz28" placeholder="请输入不通过的原因"></textarea>
					</view> 
					
				</view>
			</view>
			<view class="btm pt20 pm20 display-flex cen fz30">
				<view class="flex-1 ls" @tap="kxcxfert">
					确认
				</view>
				<view class="flex-1 red blm" @tap="kmxcfer=false">
					关闭
				</view>
			</view>
		</view>
	</view>
	<view class="kcdxvrtxzty pd pm20 bgff pt20">
		<button type="primary" class="fz32" @tap="hf('addContract')">上传合同</button>
	</view>
</template>
<script lang="ts" setup>
	import { ref } from "vue"
	import { onLoad, onReachBottom,onShow } from "@dcloudio/uni-app"
	import { dxrequest, kmxzcf, hf, transferTimeYMD,timeFrom } from "@/util/index.js"
	const page = ref(1)
	const jnxzcf = ref([])
	const kmxczxf = ref(0)
	const status = ref(0)
	const immxer = ref(['全部', '待审核', '审核通过', '审核不通过'])
	const kxcerrt = ref()
	const kmxcfer = ref(false)
	const dxsd = ref({})
	const gxsdr = ref({
		id: "",
		isPass: "",
		content:"",
		jobDay:""
	})
	const items = ref(
		[
			{
				dictValue: 2,
				dictLabel: "通过"
			},
			{
				dictValue: 3,
				dictLabel: "不通过"
			},
		]
	)
	const init = async () => {
		uni.showLoading({
			title: "加载中..."
		})
		const { data } = await dxrequest("/api/userdata/page", {
			limit: 999,
			contentType: 6,

		})
		data.list.map(a=>{
			a.imgUrl = a.imgUrl.split(",")
		})
		jnxzcf.value = data.list
		uni.hideLoading()
		uni.stopPullDownRefresh();
	}
	onShow(() => {
		init()
	})
	const kmmxcffg = (idx) => {
		jnxzcf.value = []
		page.value = 1
		kmxczxf.value = idx
		status.value = idx
		init()
	}
	// onReachBottom(() => {
	// 	page.value++
	// 	init()
	// })
	const dessdf = async (id) => {
		const ret = await dxrequest("/api/userdata", [id], "DELETE")
	}
	const dkmxdffdf = (idx, data) => {
		uni.showModal({
			title: "温馨提示！",
			content: "确认删除嘛？删除后无法恢复哦！",
			async success({ confirm }) {
				if (confirm) {
					await dessdf(data.id)
					jnxzcf.value.splice(idx, 1)
				}
			}
		})
	}
	const radioChange = (data) => {
		console.log(data)
		gxsdr.value.isPass = data.detail.value
	}
	const shenher = (item) => {
			gxsdr.value = JSON.parse(JSON.stringify(item))
		kmxcfer.value = true
		dxsd.value = item
	}
	const kxcxfert = async () => {
		if (!gxsdr.value.isPass) {
			uni.showToast({
				title: "请审核",
				icon: "none"
			})
			return
		}
		await dxrequest("/api/userdata", gxsdr.value, "put")
		dxsd.value.isPass = gxsdr.value.isPass
		kmxcfer.value = false
	}
	const kkzfds = (url,idxs) => {
		uni.previewImage({
			current:idxs,
			urls: url,
		})
	}
</script>

<style scoped>
	.cdvcxdvrtecxrt {
		border-radius: 8rpx;
		background: #fff;
		box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
	}

	.xzczfsderxct {
		width: 200rpx;
	}

	.kxzczxretxctyt {
		border: 2rpx solid #e0e0e0;
		width: 100%;
		border-radius: 8rpx;
		padding: 20rpx;
	}
	.czxczxsdt {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(1, 1fr);
		grid-column-gap: 20rpx;
		grid-row-gap: 20rpx
	}
	
	.kdfsdfsdt {
		width: 100%;
		height: 200rpx;
	
	}
	.dsfsdcxxtrt{
		padding-bottom: 200rpx;
	}
	
</style>